@charset "utf-8";
$color:#eb413d;
$return_borderColor:#e7e7e7;
$return_fontColor:#878787;
$return_fontSize:13px;
.web {
  width: 100%;
  margin: 0 auto;
  //面包屑
  .sm_subnav {
    width: 100%;
    height: 65px;
    line-height: 63px;
    border-top: 1px solid #dfdfdf;
    border-bottom: 1px solid #dfdfdf;
    .sm_subnav_ul {
      margin-left: 184px;
      li {
        float: left;
        margin-right: 10px;
      }
      li:last-child {
        color: #99999a;
      }
    }
  }
  //自己的内容
  .return_content {
    width: 1000px;
    overflow: hidden;
    margin: 0 auto;
    border-top: 2px solid $color;
    .return_content_all {
      width: 95%;
      overflow: hidden;
      margin: 0 auto;
      padding: 46px 0;
      text-align:center;
      //公共进度条
      .return_progress {
        vertical-align: top;
        display: inline-block;
        margin-left:-5px;
        :after {
          content: "";
          display: inline-block;
          clear: both;
        }
        .return_progress_div {
          float: left;
          height: 68px;
          overflow: hidden;
          .progress_line {
            overflow: hidden;
            float: left;
            p {
              padding: 6px 0 6px 10px;
              text-align:left;
            }
            .line {
              width: 155px;
              height: 1px;
              background-color: $return_borderColor;
            }
            .return_progress_color {
              background-color:$color;
            }
            .color {
              color: $color;
            }
            :after {
              content: "";
              display: inline-block;
              clear: both;
            }
          }
        }
      }
      .progress_date {
        text-align: left;
        width: 100%;
        p {
          color: #99999a;
          font-size: 14px;
        }
        .progress_date_div {
          width: 85px;
          height: 34px;
          margin-left: -12px;
          overflow: hidden;
          text-align: center;
          display: inline-block;
        }
      }
      .progress_img {
        width: 58px;
        height: 33px;
        background-color: $return_borderColor;
        position: relative;
        margin: 17px 0;
        text-align: center;
        float: left;
        &:before {
          content: "";
          border-top: 17px solid transparent;
          border-right: 29px solid transparent;
          border-bottom: 17px solid $color;
          border-left: 29px solid transparent;
          position: absolute;
          left: 0;
          top: -34px;
        }
        &:after {
          content: "";
          border-top: 17px solid $color;
          border-right: 29px solid transparent;
          border-bottom: 17px solid transparent;
          border-left: 29px solid transparent;
          position: absolute;
          left: 0;
          bottom: -34px;
        }
      }
      .disable_progress {
        width: 58px;
        height: 33px;
        background-color: $return_borderColor;
        position: relative;
        margin: 17px 0;
        text-align: center;
        float: left;
        &:before {
          content: "";
          border-top: 17px solid transparent;
          border-right: 29px solid transparent;
          border-bottom: 17px solid $return_borderColor;
          border-left: 29px solid transparent;
          position: absolute;
          left: 0;
          top: -34px;
        }
        &:after {
          content: "";
          border-top: 17px solid $return_borderColor;
          border-right: 29px solid transparent;
          border-bottom: 17px solid transparent;
          border-left: 29px solid transparent;
          position: absolute;
          left: 0;
          bottom: -34px;
        }
      }
      .return_progress_color {
        background-color:$color;
      }
    }
    //内容
    .return_form {
      width: 100%;
      overflow: hidden;
      margin-bottom: 388px;
      box-sizing:border-box;
      border:1px solid $return_borderColor;
      .return_form_left {
        float: left;
        width: 38%;
        height: 100%;
        box-sizing: border-box;
        border-right: 1px solid $return_borderColor;
        .return_left_title {
          margin: 24px 0;
          span {
            font-size: 18px;
          }
        }
        p:first-child {
          display: inline-block;
        }
        .goods_logo {
          display: inline-block;
          vertical-align: middle;
          margin-left: 18px;
        }
        .return_goods {
          width: 80%;
          margin: 42px auto 60px auto;
          .return_instructions_all {
            width: 100%;
            margin: 0 auto;
            overflow: hidden;
            border-bottom: 1px dashed $return_borderColor;
            .return_goods_img {
              display: inline-block;
              vertical-align: top;
              width: 120px;
              height: 120px;
              overflow: hidden;
              text-align: center;
              img {
                width: 60%;
                display: inline-block;
                vertical-align: middle;
              }
              .return_left_title {
                font-size: 18px;
              }
            }
            .return_goods_instructions {
              display: inline-block;
              vertical-align: top;
              width: 174px;
              p {
                font-size: 13px;
              }
              p:first-child {
                margin-bottom: 36px;
              }
            }
          }
          .return_goods_price {
            padding: 22px 0;
            border-bottom: 1px dashed $return_borderColor;
            p {
              font-size: 13px;
              color: $return_fontColor;
              margin-bottom: 22px;
              span, b {
                font-size: $return_fontSize;
                color: #000;
                margin-left: 20px;
                font-weight: 500;
              }
            }
            //隐藏框
            .logistics {
              .logistics_logo {
                display: inline-block;
                vertical-align: middle;
                position: relative;
                img {
                  width:18px;
                  height:18px;
                }
                ul li:hover >.hidden_logistics_all {
                  display: block;
                }
              }
              span {
                font-size: $return_fontSize;
                display: inline-block;
              }
              .hidden_logistics_all {
                display: none;
                .hidden_logistics {
                  position:absolute;
                  left:-100px;
                  box-shadow: 0 0 10px $return_fontColor;
                  &:before {
                    content:"";
                    display: inline-block;
                    border-right:9px solid transparent;
                    border-bottom:9px solid #ffffff;
                    border-left:9px solid transparent;
                    position: absolute;
                    left:20%;
                    top:-9px;
                  }
                  //模糊框
                  .info{
                    font-size:13px;
                    background:#fff;
                    width:500px;
                    ul {
                      margin-top:14px;
                      height:178px;
                      overflow-x:hidden;
                      overflow-y:scroll;
                      li {
                        padding-bottom:18px;
                        margin-left:16px;
                      }
                    }
                    .info_title {
                      p {
                        display: inline-block;
                        padding:15px 0;
                        margin-bottom:0;
                        border-bottom:1px dashed $return_borderColor;
                      }
                    }
                  }
                  .list{
                    width:73px;
                    display:inline-block;
                  }
                  .list_2{
                    display:inline-block;
                  }
                  .list_3{
                    display:inline-block;
                    white-space: nowrap;
                    text-overflow: ellipsis;
                    overflow: hidden;
                  }
                }
              }
            }
          }
          .return_goods_order {
            .goods_span {
              display: inline-block;
              width: 80px;
              color: $return_fontColor;
            }
            .good_span_long {
              letter-spacing: 6px;
            }
            p {
              margin-bottom:25px;
              font-size: $return_fontSize;
            }
          }
        }
      }
      .return_form_right {
        float: left;
        width: 62%;
        height: 100%;
        box-sizing: border-box;
        //选项卡
        .choose {
          width: 100%;
          height: 100%;
          overflow: hidden;
          background-color: #e7e7e7;
          #choose1, #choose2 {
            display: none;
          }
          .ch_nav {
            height: 60px;
            line-height: 60px;
            padding: 0 48px;
            background-color: #fff;
            box-sizing: border-box;
            display: inline-block;
            float: left;
            border: 1px solid $return_borderColor;
          }
          #choose1:checked + label .ch_nav1 {
            border-bottom: 4px solid $color;
          }
          #choose1:checked ~ label > .ch_nav2 {
            border-bottom: 0;
          }
          #choose2:checked + label > .ch_nav2 {
            border-bottom: 4px solid $color;
          }
          #choose2:checked ~ label > .ch_nav1 {
            border-bottom: 0;
          }
          #choose1:checked ~ .choose_div_all > .choose1_div {
            display: block;
          }
          #choose2:checked ~ .choose_div_all > .choose2_div {
            display: block;
          }
          #choose1:checked ~ .choose_div_all > .choose2_div {
            display: none;
          }
          #choose2:checked ~ .choose_div_all > .choose1_div {
            display: none;
          }
          .choose_div_all {
            height: 100%;
            overflow: hidden;
            clear: both;
            background-color: #fff;
            //表单内容
            .choose1_div {
              width: 80%;
              margin: 0 auto;
              span {
                display: inline-block;
                width: 90px;
                height: 15px;
                font-size: $return_fontSize;
                vertical-align: middle;
              }
              li {
                padding: 15px 0;
                p {
                  width: 61%;
                  margin: 12px auto 0 auto;
                }
              }
              select, input {
                padding: 11px;
                display: inline-block;
                vertical-align: middle;
              }
              textarea {
                display: inline-block;
                vertical-align: top;
                min-height: 108px;
                min-width: 352px;
                resize: none;
              }
              .prompt {
                font-size: $return_fontSize;
                color: $color;
              }
              .img_prompt {
                color: $return_fontColor;
              }
              #img_file {
                color: $return_fontColor;
                width: 138px;
                height: 38px;
                line-height: 38px;
                border: 1px solid $return_fontColor;
                text-align: center;
                vertical-align: middle;
                border-radius: 50px;
                display: inline-block;
                cursor: pointer;
              }
              input[type="file"] {
                display: none;
              }
              input[type="submit"] {
                width: 182px;
                height: 47px;
                text-align: center;
                color: #fff;
                background-color: $color;
                border-radius: 50px;
                margin-left: 20px;
                border:0;
              }
              .submit {
                width: 70%;
                text-align: center;
              }
            }
            .choose2_div {
              display: none;
              width: 80%;
              margin: 0 auto;
              input[type="radio"] {
                display: inline-block;
                vertical-align: bottom;
              }
              .radio_span {
                display: inline-block;
                vertical-align: middle;
              }
              span {
                display: inline-block;
                width: 90px;
                height: 15px;
                font-size: $return_fontSize;
                vertical-align: middle;
              }
              li {
                padding: 15px 0;
                p {
                  width: 61%;
                  margin: 12px auto 0 auto;
                }
              }
              select, input {
                padding: 11px;
                display: inline-block;
                vertical-align: middle;
              }
              textarea {
                display: inline-block;
                vertical-align: top;
                min-height: 108px;
                min-width: 352px;
                resize: none;
              }
              .prompt {
                font-size: $return_fontSize;
                color: $color;
              }
              .img_prompt {
                color: $return_fontColor;
              }
              #img_file, #img_file1 {
                color: $return_fontColor;
                width: 138px;
                height: 38px;
                line-height: 38px;
                border: 1px solid $return_fontColor;
                text-align: center;
                vertical-align: middle;
                border-radius: 50px;
                display: inline-block;
                cursor: pointer;
              }
              input[type="file"] {
                display: none;
              }
              input[type="submit"] {
                width: 182px;
                height: 47px;
                text-align: center;
                color: #fff;
                background-color: $color;
                border-radius: 50px;
                margin-left: 20px;
                border:0;
                margin-bottom:20px;
              }
              .submit {
                width: 70%;
                text-align: center;
              }
            }
            width: 100%;
          }
        }
      }
    }
  }
}
.sm_f13 {
  font-size:$return_fontSize;
}

